<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/penalize/penalizeAdd.css" />
	</head>

	<body>
		<div id="Detail">
			<header class="mui-bar mui-bar-nav">
				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left">简易程序案件</a>
				<h1 class="mui-title">
				简易程序案件详情
				</h1>
			</header>
			<div class="mui-content detail" id="pullrefresh">
				<ul class="mui-table-view">
					<li class="mui-table-view-cell mui-table-view-first ">
						<span class="mui-pull-left">案件信息</span>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p style="width: 100%;"><span style="vertical-align: top;" >案件编号：</span><i style="display: inline-block;width: 80%;">{{list.ywid}}</i></p>
						
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p><span>案件来源：</span><i>{{list.source}}</i></p>
						<p><span>所属行业：</span><i>{{list.sshy}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p style="width: 100%;"><span style="vertical-align: top;" >执法人员：</span><i style="display: inline-block;width: 80%;">{{list.zfry}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p style="width: 100%;"><span style="vertical-align: top;" >案由：</span><i style="display: inline-block;width: 80%;">{{list.caseorigin}}</i></p>
					</li>
				</ul>

				<ul class="mui-table-view" v-if="list.partytype=='个人'">
					<li class="mui-table-view-cell mui-table-view-first ">
						<span>当事人信息</span>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p style="width: 100%;"><span style="vertical-align: top;" >当事人：</span><i style="display: inline-block;width: 80%;">{{list.party}}</i></p>

					</li>
					<li class="mui-table-view-cell  mui-table-view-list  ">
						<p><span>身份证号：</span><i>{{list.sid}}</i></p>
						<p><span>手机号码：</span><i>{{list.phone}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p><span>职务：</span><i>{{list.post}}</i></p>
						<p><span>性别：</span><i>{{list.sex}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p style="width: 100%;"><span style="vertical-align: top;" >地址：</span><i style="display: inline-block;width: 80%;">{{list.personprovince}}&nbsp;{{list.personcity}}&nbsp;{{list.personarea}}&nbsp;{{list.address}}</i></p>
					</li>
				</ul>
				<!--单位-->
				<ul class="mui-table-view" v-else>
					<li class="mui-table-view-cell mui-table-view-first ">
						<span>当事人信息</span>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p><span>当事人类型：</span><i>{{list.partytype}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p style="width: 100%;"><span style="vertical-align: top;" >当事人：</span><i style="display: inline-block;width: 80%;">{{company.name}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p><span>营业执照号：</span><i>{{company.cenumber}}</i></p>
						<p><span>经营/生产地址：</span><i>{{address.city}}{{company.oaway}}{{address.address}}</i></p>
						<!--<p><span>许可证编号:</span><i>{{list.lincensenumber}}</i></p>-->
					</li>
					<li class="mui-table-view-cell  mui-table-view-list  ">
						<p ><span style="width: 2rem;">法定代表人 &nbsp;（负责人）：</span><i>{{company.legaluser}}下午回家问候和微信问候洗手</i></p>
						<p><span>手机号：</span><i>{{company.phone}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list  ">
						<p><span>身份证号：</span><i>{{company.idcard}}</i></p>
						<p><span>性别：</span><i>{{company.sex}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p><span>职务：</span><i>{{company.position}}</i></p>
					</li>
				</ul>

				<ul class="mui-table-view">
					<li class="mui-table-view-cell mui-table-view-first ">
						<span>处罚信息</span>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p class="wid100"><span>处罚依据：</span><i>{{list.cfyj}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p><span>处罚时间：</span><i>{{list.cfrq}}</i></p>
						<p><span>处罚结果：</span><i>{{list.cfjg}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list ">
						<p style="width: 100%;"><span style="vertical-align: top;" >处罚地点：</span><i style="display: inline-block;width: 80%;">{{list.punisharea}}</i></p>
					</li>
					<li class="mui-table-view-cell  mui-table-view-list upbook">
						<p><span>&nbsp;&nbsp;&nbsp;&nbsp;当场行政处罚决定书：</span></p>
						<div>
							<img :src="imgsrcfirst+i.path" alt="" data-preview-src='' data-preview-group='1' v-for="i in imgsrc" />
						</div>
					</li>
				</ul>
			</div>
			<div class="detail-btn" id="detail-btn">
				<a href="javascript:;" @click="openEdit(id,'penalizeAdd.html')">
				</a>
			</div>
		</div>
		<script src="js/mui.min.js"></script>
		<script src="js/lib/vue.js"></script>
		<script src="js/lib/jquery-1.11.0.js"></script>
		<script src="js/common/rutour.js"></script>
		<script src="js/common/server_commonFun.js"></script>
		<script src="js/lib/mui.zoom.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/lib/mui.previewimage.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init()
			mui.plusReady(function() {
				var currentView = plus.webview.currentWebview(); // 获取 当前webview
				currentView.show('slide-in-right', 300); // 显示当前webview (方式,时间)
				plus.nativeUI.closeWaiting(); // 关闭系统 loading 等待框
			})
			var vm = new Vue({
				el: "#Detail",
				data: {
					id: '',
					list: {},
					company: {},
					ajbh: '',
					punishplace: '',
					personplace: '',
					token: '',
					imgsrc: {},
					imgsrcfirst: '',
					refresh: false,
					flag: ''
				},
				mounted: function() {
					this.init();
				},
				methods: {
					init: function() {
						mui.plusReady(function() {
							window.addEventListener('refresh', function(event) {
								var current = plus.webview.currentWebview();
								vm.refresh = event.detail.flag;
								console.log(vm.refresh)
								if(vm.refresh) {
									vm.flag = 'refresh';
									plus.nativeUI.showWaiting(); // 关闭系统 loading 等待框
									vm.getData();
								}
							});

							//添加newId自定义事件监听
							vm.token = plus.storage.getItem('token');
							console.log(vm.token);
							//获得事件参数
							var current = plus.webview.currentWebview();
							vm.id = current.newsid;
							//根据id向服务器请求新闻详情
							console.log(vm.id);
							vm.getData();
							mui.previewImage();
						});

					},
					getData: function() {
						mui.ajax(
							rutour.penalize.detail + vm.token, {
								data: {
									id: vm.id
								},
								dataType: 'json', //服务器返回json格式数据
								type: 'get', //HTTP请求类型
								success: function(res) {
									if(vm.flag == 'refresh') {
										plus.nativeUI.closeWaiting();
										vm.flag = ''
									}
									vm.list = res.data.object;
									vm.company = res.data.enterprise;
									vm.address = res.data.address;
									console.log(res);
									console.log(vm.list);
									vm.imgsrcfirst = res.data.osspath;
									vm.imgsrc = res.data.filelist;
									//回显案件编号拼接
									vm.ajbh = "(" + vm.list.titlecity + ")" + "食药监" + vm.list.titlelaw + vm.list.titlenature + " " + "（" + vm.list.titleyear + "）" + vm.list.titlecode + "号"

								},
								error: function(xhr, type, errorThrown) {
									//异常处理；
									console.log(type);
								}
							});
					},
					openEdit: function(id, urlName) {
						var $contentW = localStorage.getItem('$contentW'),
							$menuLeftW = localStorage.getItem('$menuLeftW');
						var nwaiting = plus.nativeUI.showWaiting();
						webviewShow = plus.webview.create(urlName, urlName, {
							left: $menuLeftW,
							width: $contentW,
						}, {
							newsid: id
						});
					}
				}
			})
		</script>
	</body>

</html>